<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('对照结果')" />
    <th:block th:include="include :: select2-css" />
    <style type="text/css">
        .select-table table{table-layout:fixed;}.table>thead>tr>th{text-align:center;}.select-table .table td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.form-control{padding:3px 6px 4px;height:30px;}.icheckbox-blue{top:0px;left:6px;}.form-control.select2-hidden-accessible{position:static!important;}.select-table table label.error{position: inherit;}select + label.error{z-index:1;right:40px;}
    </style>
</head>
<body style="font: 14px Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif !important;">
    <div class="row" style="height: 100%">
        <!-- 字段信息 -->
        <div class="tab-pane active" id="tab-field">
            <div class="select-table table-striped" style="margin-top: 0px;padding-top: 0px;padding-bottom: 0px;">
                <table id="bootstrap-table" data-use-row-attr-func="true" data-reorderable-rows="true"></table>
            </div>
        </div>
    </div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: select2-js" />
<th:block th:include="include :: bootstrap-table-reorder-rows-js" />
<script th:src="@{/js/jquery.tmpl.js}"></script>
<th:block th:include="include :: jquery-cxselect-js" />
<script th:inline="javascript">
    var prefix = ctx + "base/dim/comp/result";
    var pid = "[[${idDimComp}]]";
    $(function() {
        var options = {
            url: prefix + "/queryByPid/"+pid,
            sortName: "sort",
            sortOrder: "desc",
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            onLoadSuccess: onLoadSuccess,
            onReorderRow: onReorderRow,
            columns: [{
                title: "序号",
                width: "8%",
                formatter: function (value, row, index) {
                    // 编号隐藏域
                    var columnIdHtml = $.common.sprintf("<input type='hidden' name='columns[%s].columnId' value='%s'>", index, row.columnId);
                    // 排序隐藏域
                    var sortHtml = $.common.sprintf("<input type='hidden' name='columns[%s].sort' value='%s' id='columns_sort_%s'>", index, row.sort, row.columnId);
                    return columnIdHtml + sortHtml + $.table.serialNumber(index);
                },
                cellStyle: function(value, row, index) {
                    return { css: { "cursor": "move" } };
                }
            },
                {
                    field: 'cdSource',
                    title: '源编码',
                    width: "20%",
                    class: "nodrag",
                    cellStyle: function(value, row, index) {
                        return { css: { "cursor": "default" } };
                    }
                },
                {
                    field: 'naSource',
                    title: '源名称',
                    width: "20%",
                    cellStyle: function(value, row, index) {
                        return { css: { "cursor": "default" } };
                    }
                },
                {
                    field: 'javaType',
                    title: 'Java类型',
                    width: "45%",
                    formatter: function (value, row, index) {
                        var data = [{ index: index, javaType: value }];
                        return $("#javaTypeTpl").tmpl(data).html();
                    }
                }]
        };
        $.table.init(options);
    });

    // 当所有数据被加载时触发处理函数
    function onLoadSuccess(data){
        $.fn.select2.defaults.set( "theme", "bootstrap" );
        $("select.form-control").each(function () {
            $(this).select2().on("change", function () {
                $(this).valid();
            })
        })
        $(".check-box").each(function() {
            $(this).iCheck({
                checkboxClass: 'icheckbox-blue'
            })
        })
    }

    // 当拖拽结束后处理函数
    function onReorderRow(data) {
        for (var i = 0; i < data.length; i++) {
            $("#columns_sort_" + data[i].columnId).val(i+1);
        }
    }

    $(function() {
        var tplCategory = $("#tplCategory option:selected").val();
        tplCategoryVisible(tplCategory);
        var genType = $('input[name="genType"]:checked').val();
        pathInfoVisible(genType);
    });

    $('#tplCategory').on('select2:select', function (event) {
        var tplCategory = $(event.target).val();
        tplCategoryVisible(tplCategory);
    });

    function tplCategoryVisible(tplCategory) {
        if("crud" == tplCategory){
            $("#treeCode").select2("val", [""]);
            $("#treeParentCode").select2("val", [""]);
            $("#treeName").select2("val", [""]);
            $("#otherInfo").addClass("hidden");
            $("#subInfo").addClass("hidden");
        } else if("tree" == tplCategory){
            $("#otherInfo").removeClass("hidden");
            $("#treeCode").attr("required", "true");
            $("#treeParentCode").attr("required", "true");
            $("#treeName").attr("required", "true");
            $("#subInfo").addClass("hidden");
        } else if("sub" == tplCategory){
            $("#subInfo").removeClass("hidden");
            $("#treeCode").select2("val", [""]);
            $("#treeParentCode").select2("val", [""]);
            $("#treeName").select2("val", [""]);
            $("#subTableName").attr("required", "true");
            $("#subTableFkName").attr("required", "true");
            $("#otherInfo").addClass("hidden");
        }
    }

    $('input').on('ifChecked', function(event){
        var genType = $(event.target).val();
        pathInfoVisible(genType);
    });

    function pathInfoVisible(genType) {
        if("0" == genType){
            $("#genPath").val("/");
            $("#pathinfo").addClass("hidden");
        } else if("1" == genType){
            $("#pathinfo").removeClass("hidden");
        }
    }

    // 选择字典处理函数
    function selectDictTree(columnId, obj) {
        var dictType = $.common.nullToStr($(obj).parent().find("input").val());
        var url = ctx + "system/dict/selectDictTree/" + columnId + "/" + dictType;
        var options = {
            title: '选择字典类型',
            width: "380",
            url: url,
            callBack: doDictSubmit
        };
        $.modal.openOptions(options);
    }

    // 选择菜单处理函数
    function selectMenuTree() {
        var parentMenuId = $("#parentMenuId").val();
        var menuId = parentMenuId > 0 ? parentMenuId : 1;
        var url = ctx + "system/menu/selectMenuTree/" + menuId;
        var options = {
            title: '菜单选择',
            width: "380",
            url: url,
            callBack: doMenuSubmit
        };
        $.modal.openOptions(options);
    }

    function doDictSubmit(index, layero){
        var body = $.modal.getChildFrame(index);
        var columnId = body.find('#columnId').val();
        var dictType = body.find('#dictType').val();
        $.modal.close(index);
        $("#columns_dict_" + columnId).val(dictType);
    }

    function doMenuSubmit(index, layero){
        var body = $.modal.getChildFrame(index);
        $("#parentMenuId").val(body.find('#treeId').val());
        $("#parentMenuName").val(body.find('#treeName').val());
        $.modal.close(index);
    }
</script>
</body>
</html>


<!-- java类型 -->
<script id="javaTypeTpl" type="text/x-jquery-tmpl">
<div>
<select class='form-control' name='columns[${index}].javaType' th:each="item:${tarData}">
    <option value=""></option>
    <option th:value="${item.cd}" th:text="${item.na}"></option>
</select>
</div>
</script>

